<!-- 测评关系管理页面 -->
<div class="content-area" id="evaluation-relation-management">
    <div class="page-header">
        <div class="page-title">测评关系管理</div>
        <div class="page-description">生成和管理部门测评、教师测评关系</div>
    </div>


    <div id="relation-generation-section"
         style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 30px;">
        <div class="table-container" id="dept-relation-generation">
            <div class="table-header">
                <div class="table-title">部门测评关系生成</div>
            </div>
            <div style="padding: 20px;">
                <p style="margin-bottom: 15px; color: #666;">生成校领导、二级学院、职能部门间的测评关系</p>
                <button class="btn btn-primary" onclick="generateDeptRelations()">
                    生成部门测评关系
                </button>
            </div>
        </div>

        <div class="table-container" id="teacher-relation-generation">
            <div class="table-header">
                <div class="table-title">教师测评关系生成</div>
            </div>
            <div style="padding: 20px;">
                <p style="margin-bottom: 15px; color: #666;">生成全体教师间的测评关系</p>
                <button class="btn btn-primary" onclick="generateTeacherRelations()">
                    生成教师测评关系
                </button>
            </div>
        </div>
    </div>

    <div class="table-container">
        <div class="table-header">
            <div class="table-title">测评关系查询</div>
        </div>

        <div class="search-form">
            <div class="form-group">
                <label class="form-label">关系类型</label>
                <select class="form-input" id="relationTypeSearch">
                    <option value="">全部</option>
                    <option value="dept">部门测评</option>
                    <option value="teacher">教师测评</option>
                </select>
            </div>
            <div class="form-group">
                <label class="form-label">被测评对象</label>
                <input class="form-input" id="relationEvaluateeSearch" placeholder="请输入被测评对象名称" type="text">
            </div>
            <div class="form-group">
                <label class="form-label">测评教师</label>
                <input class="form-input" id="evaluatorSearch" placeholder="请输入测评教师姓名" type="text">
            </div>
            <div class="form-group">
                <label class="form-label">测评状态</label>
                <select class="form-input" id="relationStatusSearch">
                    <option value="">全部</option>
                    <option value="0">未测评</option>
                    <option value="1">已测评</option>
                </select>
            </div>
            <div class="form-group">
                <label class="form-label">&nbsp;</label>
                <button class="btn btn-primary" onclick="searchRelations()">搜索</button>
            </div>
        </div>

        <div class="tabs-container">
            <div class="tabs" style="display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #ddd; margin-bottom: 20px;">
                <div style="display: flex;">
                    <div class="tab active" onclick="switchRelationTab('dept')" style="padding: 10px 20px; cursor: pointer; border-bottom: 2px solid #007bff;">
                        部门测评关系
                    </div>
                    <div class="tab" onclick="switchRelationTab('teacher')" style="padding: 10px 20px; cursor: pointer; border-bottom: 2px solid transparent;">教师测评关系
                    </div>
                </div>
                <!-- 导出按钮区域 -->
                <div style="display: flex; gap: 10px;">
                    <button id="exportDeptBtn" class="btn btn-success" onclick="exportDeptRelations()" style="background-color: #28a745; color: white; border: none; padding: 8px 16px; border-radius: 4px; cursor: pointer; font-size: 14px;">📊 导出部门测评关系</button>
                    <button id="exportTeacherBtn" class="btn btn-success" onclick="exportTeacherRelations()" style="background-color: #17a2b8; color: white; border: none; padding: 8px 16px; border-radius: 4px; cursor: pointer; font-size: 14px; display: none;">📊 导出教师测评关系</button>
                </div>
            </div>

            <!-- 部门测评关系子页面 -->
            <div class="tab-content active" id="dept-relation-tab">
                <div class="table-content" id="deptRelationsTableContent">
                    <table class="data-table">
                        <thead>
                        <tr>
                            <th>关系ID</th>
                            <th>被测评部门</th>
                            <th>测评教师</th>
                            <th>测评教师部门</th>
                            <th>测评指标编号</th>
                            <th>测评权重编号</th>
                            <th>测评权重名称</th>
                            <th>总分</th>
                            <th>第一分数</th>
                            <th>第二分数</th>
                            <th>第三分数</th>
                            <th>第四分数</th>
                            <th>测评标识</th>
                            <th>测评时间</th>
                            <!--th>操作</th-->
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td class="loading" colspan="15">加载中...</td>
                        </tr>
                        </tbody>
                    </table>
                    <div class="pagination-container" id="deptRelationPagination"></div>
                </div>
            </div>

            <!-- 教师测评关系子页面 -->
            <div class="tab-content" id="teacher-relation-tab">
                <div class="table-content" id="teacherRelationsTableContent">
                    <table class="data-table">
                        <thead>
                        <tr>
                            <th>关系ID</th>
                            <th>被测评教师</th>
                            <th>被测评教师部门</th>
                            <th>测评教师</th>
                            <th>测评教师部门</th>
                            <th>测评指标编号</th>
                            <th>测评权重编号</th>
                            <th>测评权重名称</th>
                            <th>排序</th>
                            <th>总分</th>
                            <th>第一分数</th>
                            <th>第二分数</th>
                            <th>第三分数</th>
                            <th>第四分数</th>
                            <th>测评标识</th>
                            <th>测评时间</th>
                            <!--th>操作</th-->
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td class="loading" colspan="17">加载中...</td>
                        </tr>
                        </tbody>
                    </table>
                    <div class="pagination-container" id="teacherRelationPagination"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
// 导出函数
function exportDeptRelations() {
    console.log('导出部门测评关系');
    const url = '/evaluation/api/admin/relation/dept/export';
    window.open(url, '_blank');
}

function exportTeacherRelations() {
    console.log('导出教师测评关系');
    const url = '/evaluation/api/admin/relation/teacher/export';
    window.open(url, '_blank');
}
</script> 